<template>
  <div class="cbg c-pb24">
    <div class="title c-ph24 pt232">
      <div class="c-bg-white c-ww592 c-ph20 c-pv20 c-br16 c-flex-row c-aligni-center c-justify-sb">
        <div class="c-flex-column">
          <span class="c-fs28 c-fw-b">开启关怀模式</span>
          <span class="c-fs22 c-fc-gray c-pt10">开启后，还需要去微信中开启</span>
        </div>
        <x-switch :themeColor="$getThemeColor()" title="" v-model="enableCare" prevent-default @on-click="changeSwitch()" :value-map="[false, true]"></x-switch>
      </div>
    </div>
    <div class="c-bg-white c-ww592 c-ph20 c-pv20 c-br16 c-mt24 c-m-0auto">
      <div class="c-br10 c-bg-F6F7F9 c-w100 c-pv20 c-ph24 c-fs22">开启方式：<span class="c-fw-b">微信 > 设置 > 关怀模式</span> <span class="c-fs20">(仅在微信内生效)</span></div>
      <img class="c-w100 c-mt20" src="https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/common/guanhuai3.png" />
    </div>
  </div>
</template>

<script>
import { XSwitch } from 'ckjrweb-mp-ui/src/components/index';
import { utilJs } from "@/utils/common.js"
export default {
  name: 'CareInfo',
  components: {
    XSwitch
  },
  props: [],
  beforeCreate() {

  },
  data() {
    return {
      enableCare: false, // 是否开启关怀模式
    }
  },
  created() {
    utilJs.appShare(this);
  },
  mounted() {
    setDocumentTitle("关怀模式");// eslint-disable-line
    if (!localStorage.getItem("careModel")) {
      setTimeout(() => {
        this.enableCare = localStorage.getItem("careModel") == 0 ? false : true;
      }, 1000);
    } else {
      this.enableCare = localStorage.getItem("careModel") == 0 ? false : true;
    }
    this.$forceUpdate();
    this.wechatShare();
    this.$store.commit('updateLoadingStatus', {
      isLoading: false
    });
  },
  computed: {

  },
  watch: {

  },
  methods: {
    changeSwitch() {
      this.enableCare = this.enableCare == false ? true : false;
      utilJs.postMethod(global.apiurl + 'members/saveCareModel', {careModel: this.enableCare == true ? 1 : 0}, res => {
        localStorage.setItem("careModel", this.enableCare == true ? 1 : 0);
        this.$showCjToast({
          text: this.enableCare == true ? '已开关怀模式' : '已关关怀模式',
          type: 'text',
        });
        window.location.reload(true);
      });
    },
    //分享
    wechatShare: function () {
      utilJs.wechatConfig("", "", "", "", function () { });
    },
    //手机端分享
    appShare: function () {
      utilJs.appShareTrue("", "", "", "");
    }
  },
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.title {
  background-image: url('https://ck-bkt-knowledge-payment.oss-cn-hangzhou.aliyuncs.com/admin/material/9_material_admin/image/assets/i/wap/common/guanhuai2.png');
  background-repeat: no-repeat;
  background-size: 16rem auto;
}
.cbg {
  background-color: #DFF3FE;
}
.pt232 {
  padding-top: 5.8rem;
}
</style>
